<template>
	<view class="whole">
		<view class="settlement">
			<view class="settlementf" v-for="(item,index) in dicDataList " :key="index" >
				<view @click="button(item)" class="settlementDesk">{{item.dataName}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dicDataList:[],
			}
		},
		onLoad() {
			this.getsettlementDesk()
		},
		methods: {
			async getsettlementDesk() {
				const res = await this.$myRequest({
					url: '/api-portal/dictionary/'+"dicSettlementDesk"+'/datas',
					method: "get",
					
				})
				if (res.success == true) {
					this.dicDataList=res.body.dicDataList
					console.log(res.body.dicDataList)
				}
			},
			button(dicDataList){
				uni.navigateTo({
					url: '/pages/callThePolice/menuAlarm/index?dataCode=' +dicDataList.dataCode+'&dataName='+dicDataList.dataName
				})
			}
		}
	}
</script>

<style scoped lang="less">
	.whole{
		width: 100%;
		height: 100%;
		position: fixed;
		background-image: url(../../../static/image/Settlementdeskbg.png);
		background-repeat:no-repeat;
		background-size:100% 100%;
		.settlement{
			padding-top:60vh;
			.settlementf:nth-last-child(even){
				display: flex;
				justify-content: center;
				.settlementDesk{
					background-color: #FFC060;
					color: #FFFFFF;
					font-size: 20px;
					text-align: center;
					border-radius: 30px;
					width: 80%;
					height: 100rpx;
					line-height: 100rpx;
					// margin-top: 1%;
				}
			}
			.settlementf:nth-last-child(odd){
				display: flex;
				justify-content: center;
				.settlementDesk{
					background-color: #109EF8;
					color: #FFFFFF;
					font-size: 20px;
					text-align: center;
					border-radius: 30px;
					width: 80%;
					height: 100rpx;
					line-height: 100rpx;
					margin-top: 50rpx;
				}
			}
		}
	}

</style>
